<!--{__NOLAYOUT__}-->
{include file="../application/admin/view/template/header.html" /}

<div style="width: 95%;margin: 15px">
<form class="layui-form" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">用户账号</label>
        <div class="layui-input-inline">
            <input type="text" name="user" required  lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">用户昵称</label>
        <div class="layui-input-inline">
            <input type="text" name="nick" required  lay-verify="required" placeholder="请输入昵称" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">用户密码</label>
        <div class="layui-input-inline">
            <input type="password" name="password" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
        </div>
        <!--<div class="layui-form-mid layui-word-aux">辅助文字</div>-->
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">重复密码</label>
        <div class="layui-input-inline">
            <input type="password" name="rpassword" required lay-verify="required" placeholder="请重复密码" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" >是否启用</label>
        <div class="layui-input-block">
            <input type="checkbox" name="status" lay-skin="switch" checked value="1" lay-text="启用|禁用">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" >用户头像</label>
        <div class="layui-input-block">
            <button type="button" class="layui-btn layui-btn-primary" id="test1">
                <i class="layui-icon">&#xe64a;</i>选择头像
            </button>
            <input type="hidden" name="imgurl" value="default_head.png">
        </div>
        <div class="layui-input-block">
            <img id="upload-img" src="/uploads/admin/avatar/default_head.png" style="margin: 5px 0 5px 0;width: 100px;height: 100px;border: 1px solid">
        </div>
        <div class="layui-input-block">
            <button type="button" class="layui-btn" id="ListAction">
                <i class="layui-icon">&#xe67c;</i>确认上传
            </button>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">用户权限</label>
        <div class="layui-input-block">
            {foreach $groups as $vo}
            <input type="checkbox" name="auth[]" title="{$vo.title}" value="{$vo.id}">
            {/foreach}
        </div>
        </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="sublime-btn">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
</div>
<script>
    //Demo
    layui.use(['form','upload'], function(){
        var form = layui.form
            ,  upload=layui.upload;
        //监听提交
        form.on('submit(sublime-btn)', function(data){
            // layer.msg(JSON.stringify(data.field));
            console.log(data.field);
            if (data.field.password != data.field.rpassword) {
                layer.msg('两次密码不一样', {icon: 2,anim:6,time: 2000});
                return false;
            }
            layer.load(2);
            $.post('/admin/user/adduser',data.field,function (res) {
                if (res.status==false) {
                    layer.msg(res.msg, {icon: 2,anim:6,time: 2000});
                    layer.closeAll('loading'); //关闭加载层
                    return false
                }
                layer.msg(res.msg, {icon: 1,anim:5,time: 2000});
                layer.closeAll('loading'); //关闭加载层
                parent.reloadTable();
                parent.layer.closeAll('iframe');
                console.log(res);
            });
            return false;
        });


        var uploadInst = upload.render({
            elem: '#test1' //绑定元素
            ,url: '/admin/upload/headUpload' //上传接口
            ,auto: false //选择文件后不自动上传
            ,bindAction: '#ListAction' //指向一个按钮触发上传
            //预读本地文件
            ,choose:function (obj) {
                obj.preview(function (index,file,result) {
                    $('#upload-img').attr('src',result);
                });
            }
            ,done: function(res){
                $('input[name="imgurl"]').val(res.data);
                layer.msg('上传成功', {icon: 1,anim:5,time: 2000});
            }
            ,error: function(){
                //请求异常回调
            }
        });
    });
</script>